<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>貂蝉到家</title>
    <link rel="icon" href="images/logo.png" />
    <script src="/wap.js"></script>
    <link rel="stylesheet" href="/styles/index-1572edca.css" />
    <link rel="stylesheet" href="/styles/index-3bc3c1d2.css" />
    <link rel="stylesheet" href="/styles/index-40233114.css" />
    <link rel="stylesheet" href="/styles/index-2ec46398.css" />
    <link rel="stylesheet" href="/styles/index-fae19b82.css" />
    <link rel="stylesheet" href="/styles/home-0cc2d347.css" />
    <link rel="stylesheet" href="/styles/index.css" />
  </head>
  <body>
    <div id="app" data-v-app="" style="background: rgb(12, 14, 21)">
      <div data-v-17b9773b="">
        <div data-v-f094a4d2="" data-v-17b9773b="" class="app">
          <div data-v-6ae044b0="" data-v-f094a4d2="" class="container">
            <header
              data-v-6ae044b0=""
              class="app-header flex flex-centers flex-space black-bg"
            >
              <div style="color: #fff; display: flex; align-items: center">
                <img
                  data-v-6ae044b0=""
                  src="/assets/logo.png"
                  alt=""
                  class="logo"
                />
              </div>
              <!---->
              <div data-v-6ae044b0="" class="navbar-icon" id="navbar-id">
                <img id="image1" data-v-6ae044b0="" style="display: block;" src="" alt="" class="icon cursorp">
                <img id="image2" data-v-6ae044b0="" style="display: none;" src="" alt="" class="icon cursorp">
              </div>
              <div data-v-6ae044b0="" class="navbar flex flex-wrap">
                <a
                  data-v-6ae044b0=""
                  href="/"
                  class="router-link-active nav-item active"
                  >首页</a
                >
                <a data-v-6ae044b0="" href="/history.html" class="nav-item"
                  >发展历程</a
                >
                <a data-v-6ae044b0="" href="/about.html" class="nav-item"
                  >关于我们</a
                >
              </div>
              <div
                id="menu"
                data-v-6ae044b0=""
                class="menu black-bg"
                style="display: none"
              >
                <a
                  data-v-6ae044b0=""
                  href="/"
                  class="router-link-active nav-item active"
                  >首页</a
                >
                <a data-v-6ae044b0="" href="/history.html" class="nav-item"
                  >发展历程</a
                >
                <a data-v-6ae044b0="" href="/about.html" class="nav-item"
                  >关于我们</a
                >
              </div>
            </header>
          </div>
          <div data-v-342be66a="" data-v-f094a4d2="">
            <section data-v-342be66a="" class="app-main">
              <div data-v-200ec4a0="" data-v-342be66a="" class="home">
                <div data-v-200ec4a0="" class="container container-flex">
                  <img
                    id="pc-img"
                    data-v-200ec4a0=""
                    src="/images/1.png"
                    alt=""
                    class="app-img"
                  />
                  <div data-v-200ec4a0="" class="content">
                    <div data-v-200ec4a0="" class="title">貂蝉到家</div>
                    <div data-v-200ec4a0="" class="subtitle flex flex-centers">
                      <span data-v-200ec4a0="">足不出户享受</span
                      ><span data-v-200ec4a0="" class="key"
                        >便捷舒适的推拿服务</span
                      >
                    </div>
                    <div data-v-200ec4a0="" class="desc">
                      貂蝉到家服务于2018年成立，是国内领先的上门推拿O2O服务平台，提供专业、正规、安全、便捷的24小时上门推拿服务。经过5年的沉淀积累，已经有不少消费者选择貂蝉到家平台，并且拥有了一批忠实稳定的客户。截止至2024年9月，貂蝉到家已经在全国43个城市设立运营中心，在全国109座城市提供24小时上门推拿服务。貂蝉到家服务支持微信公众号、客户端等渠道进行预约，足不出户即可享受舒适便捷的上门推拿服务。
                    </div>
                    <div
                      data-v-200ec4a0=""
                      class="platform flex flex-centers flex-space"
                    >
                      <div data-v-200ec4a0="" class="plat-item flex-center flex plat-item-min" >
                        <div data-v-200ec4a0=""  class="btn cursorp flex flex-center">
                          <img
                            data-v-200ec4a0=""
                            src=""
                            alt=""
                            class="icon"
                          /><span data-v-200ec4a0="">
                            <a href="https://app.diaochan88.com/h5/">公众号版</a>
                          </span>
                        </div>
                      </div>
                      <div
                        data-v-200ec4a0=""
                        class="plat-item el-tooltip__trigger el-tooltip__trigger"
                      >
                        <div
                          data-v-200ec4a0=""
                          class="btn cursorp flex flex-center"
                        >
                          <img
                            data-v-200ec4a0=""
                            src=""
                            alt=""
                            class="icon"
                          /><span data-v-200ec4a0="">公众号版</span>
                        </div>
                        <div data-v-200ec4a0="" class="qr">
                          <img
                            data-v-200ec4a0=""
                            src="/images/wechat-qr-414d01d2.png"
                            alt=""
                            class="qr-img"
                          />
                        </div>
                      </div>
                    </div>
                    <img
                      id="h5-img"
                      data-v-200ec4a0=""
                      src="/images/h5-app3-1.png"
                      alt=""
                      class="min-app-img"
                    />
                  </div>
                  <img
                    data-v-200ec4a0=""
                    src="/assets/h5-bg-a168444b.png"
                    alt=""
                    class="bg-img"
                  />
                </div>
              </div>
            </section>
          </div>
          <div data-v-8a305030="" data-v-f094a4d2="">
            <footer
              data-v-8a305030=""
              class="app-footer flex flex-center black-bg"
            >
              <div data-v-8a305030="" class="server-list flex flex-centers">
                <a
                  data-v-8a305030=""
                  href="/service.html"
                  class="server-item no-border"
                  target="_blank"
                  >服务条款</a
                ><a
                  data-v-8a305030=""
                  href="/privacy.html"
                  class="server-item"
                  target="_blank"
                  >隐私说明</a
                >
              </div>
              <div data-v-8a305030="" class="flex flex-center flex-wrap">
                <div data-v-8a305030="" class="text">
                  Copyright © 2019-2024 重庆淑妃健康管理有限责任公司 版权所有
                </div>
                <div data-v-8a305030="" class="text flex flex-centers">
                  <img
                    data-v-8a305030=""
                    src=""
                    class="icp"
                    alt=""
                  />
                  <a
                    data-v-8a305030=""
                    href="https://www.beian.gov.cn/portal/registerSystemInfo?recordcode=50019002503183"
                    target="_blank"
                    >渝公网安备 50019002503183号</a
                  >&nbsp;&nbsp;&nbsp;&nbsp;<a
                    data-v-8a305030=""
                    href="https://beian.miit.gov.cn/#/Integrated/index"
                    target="_blank"
                    >渝ICP备13006603号-9</a
                  >
                </div>
              </div>
            </footer>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>


<script>

  const menu = document.getElementById('menu')
  const navbarId = document.getElementById('navbar-id')
  const image1 = document.getElementById('image1')
  const image2 = document.getElementById('image2')

  navbarId.addEventListener('click',()=>{
    if(image1.style.display === 'block'){
      image2.style.display = 'block'
      image1.style.display = 'none'
      menu.style.display = 'block'
    }else{
      image2.style.display = 'none'
      image1.style.display = 'block'
      menu.style.display = 'none'
    }
  })

  function debounce(func, wait) {
    let timeout;
    return function() {
      const context = this;
      const args = arguments;
      if (timeout !== undefined) {
        clearTimeout(timeout);
      }
      timeout = setTimeout(function() {
        func.apply(context, args);
      }, wait);
    };
  }

  let timer;
  function swiper(ele, arr){
    let i = 0;
    timer = setInterval(() => {
      i = (i + 1) % arr.length;
      ele.src = arr[i]
    }, 2000);
  }

  const pc = document.getElementById('pc-img')
  const h5 = document.getElementById('h5-img')
  const h5Arr = ['/images/h5-app3-1.jpg', '/images/h5-app3-2.png', '/images/h5-app3-3.png']
  const pcArr = ['/images/1.png', '/images/2.png', '/images/3.png']

  let currentSizeCategory = null;
  window.addEventListener('resize', debounce(()=>{
    const newSizeCategory = window.innerWidth < 640 ? 'small' : 'large';
    if (newSizeCategory !== currentSizeCategory) {
      // 停止当前的定时器（如果有的话）
      if (timer) {
        clearInterval(timer);
        timer = null;
      }
      // 根据新的尺寸分类启动相应的轮播
      if (newSizeCategory === 'small') {
        swiper(h5, h5Arr);
      } else {
        swiper(pc, pcArr);
      }
      currentSizeCategory = newSizeCategory;
    }
  },300))

  function init(){
    if(window.innerWidth < 640){
      if (timer === undefined){
        swiper(h5, h5Arr)
      }
    }else{
      if (timer === undefined){
        swiper(pc, pcArr)
      }
    }
  }


  init()
</script>